@import "../pub/mixins.less";
@import "../pub/vars.less";

.info {

    width: 100%;
    // height: calc(100% - 50px);
    // background-color: aliceblue;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;

    .top {
        background-color: #fff;
        display: flex;
        position: relative;
        padding: 0 15px;

        .toplist {
            display: flex;
            align-items: center;
            padding: 20px 0;

            .imgtop {
                // background-size: 20%;
                // background-repeat: repeat;
                width: 13%;
                border-radius: 80px;
                margin-right: 10px;
            }

            .name {
                font-size: 19px;
                font-weight: 600;
            }

            .message {
                font-size: 13px;
                color: #999;
            }
        }

        .toprigth {
            position: absolute;
            position: absolute;
            right: 0;
            background-color: yellow;
            transform: rotate(34deg);
            bottom: 21px;
            color: #000000;
            font-size: 21px;
            padding: 10px;
            border-radius: 16px;
        }

        .toprigthw {
            position: absolute;
            position: absolute;
            right: 0;
            background-color: red;
            transform: rotate(34deg);
            bottom: 21px;
            color: #000000;
            font-size: 21px;
            padding: 10px;
            border-radius: 16px;
        }

    }

    .ceshitext {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0 15px 15px 15px;

        .leftceshi {
            .leftext {
                font-size: 16px;
                color: #000;
            }

            .lefttime {
                font-size: 13px;
                color: #bfb7b7;
            }
        }

        .righttext {
            color: red;
            font-size: 15px;
            border: 1px solid yellow;
            padding: 4px;
            border-radius: 10px;
        }
    }

    .foot {
        width: 90%;
        margin: 0 auto;

        .foottext {
            margin-bottom: 8px;
            line-height: 21px;
            font-size: 14px;
        }

        .footimga {
            display: flex;
            align-items: center;
            justify-content: center;

            .footimg {
                width: 90%;
                height: auto;
            }
        }

    }

    .shouone {
        position: absolute;
        font-size: 14px;
    }


    .imgthree {
        display: flex;
        align-items: center;
        justify-content: center;

        .wrapper {
            width: 70%;
            background-color: rgb(92, 83, 83);
            height: 47vh;
            border-radius: 10px;
            display: flex;
            align-items: center;
            flex-direction: column;
            justify-content: space-around;

            .imgtitle {
                width: 40%;
                border-radius: 70px;
            }

            .tetext {
                color: #ecb600;
                font-size: 14px;
                padding: 8px;
                border-radius: 10px;
                border: 1px solid #ecb600;

            }

            .lasttext {
                font-size: 12px;
                color: #bfb7b7;
            }
        }


    }
}